<template>
    <div class="" v-show="invite.isReceived">



      <div class="invite-top">

        <div class="invite-box" v-if="invite.isReceived == 0">
          <span class="ib invite-user-head bg-img-clip" :style="{'backgroundImage':`url(${invite.userIcon})`}"></span>
          <p class="invite-user-text"><span class="invite-text text-primary">{{invite.userName}}</span> 邀请你一起来Vii健身</p>
          <div class="img-er-code ib" ></div>
          <p style="font-size : 12px;" class="text-color-light">长按识别后，即可领取 {{invite.rewordPrice}} 元代金券</p>
        </div>
      </div>


        <div class="invite-top" v-if="invite.isReceived == 1">
          <span class="ib invite-user-head bg-img-clip" :style="{'backgroundImage':`url(${invite.userIcon})`}"></span>
          <p class="invite-user-text"><span class="invite-text text-primary">{{invite.userName}}</span> 邀请你一起来Vii健身</p>
        </div>


        <div class="text-center mt20">
          <div class="img-card-bg  pos-rel ib">
            <span class="img-card-bg-price">{{invite.rewordPrice}}</span>
          </div>
        </div>


        <div  v-if="invite.isReceived == 1" class="" style="padding : 0 15px; margin-top:100px;">
          <button class="btn btn-primary btn-ve-md btn-block">您已经领取过该奖励，点击邀请朋友</button>
          <p class="text-center text-color-light mt10" style="font-size:12px;">您和TA分别获得{{invite.rewordPrice}}元代金券</p>
        </div>



    </div>
</template>
<style lang="scss" scoped>
  @import "../../../common/skin/var";


  .invite-top{
    margin-top: 20px;
    text-align: center;

  }
  .invite-user-head{
      width: 85.5px;
      height: 85.5px;
      overflow: hidden;
      border-radius: 100%;
      border: 1px solid $primary-color;

  }
  .img-er-code{
    margin-bottom: 15px;
  }


  .invite-user-text{
    font-size: 16px;
    margin: 15px 0;
  }

  .invite-box{
    margin-top: 46px;
    background: #fff;
    box-shadow: 0 1px 2px 0 #BEBEBE;
    width: 280px;
    border-radius: 2px;
    display: inline-block;
    padding: 15px;
    position: relative;

    .invite-user-head{
      position: absolute;
      top: -44px;
      left: 50%;
      margin-left: -42px;
    }

    .invite-user-text{
      margin-top : 43px;
    }
  }
</style>
<script>
    import Util from "util";
    import API from "api";

    export default{
        data(){
            return{
              invite : {}
            }
        },
        mounted : function(){

          let id = this.$route.params.id;
          if(!id){
            Util.UI.toast("id未传递!");
            return;
          }

          API.biz.getInviteInfo(id,{hasLoading : true})
            .then(res=>{
                this.invite = res.bizData;

              wx.ready(()=>{
                   Util.WX.sharePage({
                    "desc": `${this.invite.userName}邀请你一起来Vii健身`,
                    "title": `接受邀请后，你和TA分别获得${this.invite.rewordPrice}元代金券`,
                    link: `http://${window.getAbsHost()}/#/market/share/${this.invite.userId}`,
                    imgUrl: "http://www.7vii.cn/logo.png"
                 });
               });

            });


        },
        components:{
        }
    }
</script>
